<template>
	<view class="">
		<uni-popup type='bottom' v-show='show' :mask-click="false" ref='weipai'>
			<view class="weipai">
				<image src="@/static/statc-icon/close.png" class='icon' @tap='handleClosePopup' mode=""></image>
				<view class="header">
					商品提货
				</view>

				<view class="content">
					<addressComVue ref='addressComList' />
				</view>
				<view class="popupBtn" @click='isProp = true'>
					立即提货
				</view>
			</view>

		</uni-popup>

		<passWordPopup :show='isProp' @close='isProp=false' @callBack="sure" />
	</view>
</template>

<script>
	import passWordPopup from './passWordPopup.vue'
	import addressComVue from './addressCom.vue'
	export default {
		name: 'tihuoPopup',
		props: {
			goodsInfo: {
				type: Object,
				default: () => {}
			},
			show: {
				type: Boolean,
				default: false
			},
			// callBack:{
			// 	type:Function,
			// }
		},
		data() {
			return {
				isProp: false,
			}
		},
		onShow() {


		},
		components: {
			addressComVue,
			passWordPopup
		},
		watch: {
			show(newVal) {
				if (newVal) {
					this.$refs.weipai.open('bottom')
				} else {
					this.$refs.weipai.close()
				}
			}
		},
		methods: {
			handleGetAddressList() {
				this.$refs.addressComList.getAddressList()
			},
			handleClosePopup() {
				this.$emit('close')
			},
			sure(payPassword){
				if (!payPassword) {
					uni.showToast({
						icon: 'none',
						title: '请输入支付密码'
					})
					return false
				}
				this.handleSellGoods0214(payPassword)
			},
			handleSellGoods0214(payPassword) {
				this.$emit('close')
				this.$emit("sure", {
					"id": this.$props.goodsInfo.id,
					"addressId": this.$refs.addressComList.addressId,
					"payPassword":payPassword
				})
			}
		}

	}
</script>

<style lang="less" scoped>
	.weipai {
		width: 100%;
		// height: 556rpx;
		padding-bottom: 40rpx;
		background: #FFFFFF;
		position: relative;
		border-top-right-radius: 50rpx;
		border-top-left-radius: 50rpx;

		.icon {
			width: 48rpx;
			height: 48rpx;
			position: absolute;
			top: 32rpx;
			right: 46rpx;
		}

		.header {
			width: 100%;
			height: 88rpx;
			background: #FFFFFF;
			box-shadow: 0px 2rpx 2rpx 0px rgba(167, 167, 167, 0.25);
			padding: 16rpx 40rpx;
			box-sizing: border-box;
			// border-bottom: 2rpx solid #A7A7A7;
			display: flex;
			align-items: center;
			border-top-right-radius: 50rpx;
			border-top-left-radius: 50rpx;
		}

		.content {
			display: flex;
			padding: 40rpx;

			.prodImage {
				width: 200rpx;
				height: 200rpx;
				border-radius: 8rpx;
				margin-right: 20rpx;
			}

			.left {
				flex: 1;
				display: flex;
				flex-direction: column;
				font-weight: bold;
				font-size: 28rpx;
				color: #3C3C3C;

				.titlePopup {
					font-weight: bold;
					font-size: 28rpx;
					color: #3C3C3C;
					margin-bottom: 20rpx;
					height: 58rpx;
				}

				.options-poup {
					display: flex;
					align-items: center;

					.allbtn-popup {
						width: 124rpx;
						height: 48rpx;
						background: #FC365E;
						border-radius: 40rpx;
						font-weight: bold;
						font-size: 24rpx;
						color: #FFFFFF;
						display: flex;
						justify-content: center;
						align-items: center;
						margin-left: 20rpx;
					}
				}

				.countDown {
					display: flex;
					align-items: center;

					.num {
						width: 132rpx;
						height: 56rpx;
						background: #FFFFFF;
						border: 2rpx solid #F7F7F7;
						display: flex;
						align-items: center;
						justify-content: center;
						font-weight: bold;
						font-size: 32rpx;
						color: #000000;
					}

					.updownicon {
						width: 56rpx;
						height: 56rpx;

					}
				}

				.pricePopup {
					font-weight: bold;
					font-size: 40rpx;
					color: #FF3C2D;
					margin-top: 20rpx;
				}

				.pricePopup:before {
					content: "预售￥";
					font-weight: bold;
					font-size: 20rpx;
					color: #FF3C2D;
				}

			}
		}

		.popupBtn {
			width: 670rpx;
			height: 88rpx;
			background: linear-gradient(90deg, #FF7A3F 0%, #FC3260 100%);
			border-radius: 112rpx;
			margin: 0 auto;
			font-weight: bold;
			font-size: 32rpx;
			color: #FFFFFF;
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
</style>